import "./TopNav.scss";
 // 构建缩放选项
 function buildScaleOption(start = 25, end = 200, step = 25) {
    let options = [];
    for (let i = start; i <= end; i += step) {
        options.push({ value: i / 100, label: i + '%' })
    }
    options.push({ value: 200, label: "200%" }, { value: 300, label: "300%" }, { value: 400, label: "400%" }, { value: "fit", label: "适合" })
    return options
}
function TopNav() {
    const [scaleOptions, setScaleOptions] = useState(buildScaleOption())
    const handleChange = (value: string) => {
        console.log(`selected ${value}`);
    };

    return (
        <Flex className="lego-editor-top-nav"
            gap="middle" align="center">
            <div className="lego-editor-top-nav-logo">LEGOBI</div>
            <div className="lego-editor-top-nav-title">2024经济发展潜力</div>
            <Select
                defaultValue="100%"
                onChange={handleChange}
                style={{ width: 100, textAlign: 'center' }}
                options={scaleOptions}
            />
            <div className="lego-editor-top-nav-action">
                <Button type="primary" size="small">保存</Button>
                <Button type="primary" size="small">预览</Button>
                <Button type="primary" size="small">发布</Button>
            </div>
        </Flex>
    )
}
export default TopNav